<template>
    <div class='cemetery' >
        <!--div id="preloader-body">
            <div id="cube-wrapper">
                <div class="cube-folding">
                    <span class="leaf1"></span>
                    <span class="leaf2"></span>
                    <span class="leaf3"></span>
                    <span class="leaf4"></span>
                </div>
                <span class="loading" data-name="Loading">Loading</span>
            </div>
        </div-->
        <div class='commonList_title commonList_title_app2' v-if="isApp=='Y'&&isAppTop=='Y'&&isTitle=='Y'" >  <i class='el-icon-arrow-left' @click="returns" style='margin-right:10px;float:left;line-height:30px'>返回</i><i class='fa fa-info-circle'></i>墓位信息</div>
        <div class='commonList_title commonList_title_app' v-if="isApp=='Y'&&isAppTop==''&&isTitle=='Y'" >  <i class='el-icon-arrow-left' @click="returns" style='margin-right:10px;float:left;line-height:30px'>返回</i><i class='fa fa-info-circle'></i>墓位信息</div>
        
        <el-row class="tac">
            <el-col :sm="6" :md="6"  :lg="4" :xl="4" class='cols' >
               
                <div class='menu ' >
                     <div class='left_tree_head' v-if="type=='jc'">
                        寄存区选择
                    </div>
                    <div class='left_tree_head' v-else>
                        陵园选择
                    </div>
                    <div class='mytree2'>
                    <el-tree
                        :data="leftMenu"
                        :props="defaultProps"
                        node-key="id"
                        ref="elMenu"
                        class="tree-line2"
                        check-strictly
                        
                        highlight-current
                        :default-expanded-keys="defaultShowNodes"
                        @node-click="handleNodeClick2"
                       >
                    </el-tree>
                    </div>
                    <div class='left_btn' :class='{"left_btn":true,"left_btn_app":isApp=="Y"}' style='border-top:1px solid #ddd' v-if="isList!='Y'">
                        <div :class='{"cemetery_show":true}' v-for="(item,index) in mxColor" :key="index">
                            <div class='cemetery_show_color_1' style='display:none'>
                                &nbsp;
                            </div>
                            <i class='icon iconfont iconfont2 icon-mubei' :style="{'font-size':'14px','color':item.color,'marginRight':'5px'}"></i>
                               
                            <span :style="{'color':'#a2a3a5','fontSize':'12px'}">{{item.label}}</span>
                        </div>

                        
                    </div>
                </div>
                
                
            </el-col>
            <el-col :sm="18" :md="18" :lg="20" :xl="20"  class='cols2' v-if="isList=='Y'">
                <common-list ref="commonLists" listname="" appid="business" model="业务管理/骨灰寄存" model_key="公墓信息管理系统/骨灰寄存" @openWin="openList"></common-list>
            </el-col>
            <el-col :sm="18" :md="18" :lg="20" :xl="20"  class='cols2' v-if="isList!='Y'">
                <div class='btnss' v-if="isSet=='Y'||isSet2=='Y'||isSet2=='A'">
                        <el-dropdown  v-if="isSet2!='Y'" >
                            <el-button type="primary">
                                墓区管理<i class="el-icon-arrow-down el-icon--right"></i>
                            </el-button>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item icon="el-icon-circle-plus-outline" @click.native="openAddArea('/commonEdit','0')">新增区</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-edit-outline"  @click.native="openEditArea('/commonEdit')">修改区</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-delete" @click.native="delArea()">删除区</el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>

                        <el-dropdown style='margin-left:10px'  v-if="isSet2!='Y'" >
                            <el-button type="success">
                                墓位管理<i class="el-icon-arrow-down el-icon--right"></i>
                            </el-button>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item icon="el-icon-circle-plus-outline" @click.native="openWin(`新增墓位#/commonEdit#${systemNames}/业务管理/墓位管理/修改墓位`)">新增墓位</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-edit-outline"  @click.native="openWin2(`批量新增墓位#/commonEdit#${systemNames}/业务管理/墓位管理/批量新增墓位#cemetery`)">批量新增墓位</el-dropdown-item>
                                <!--el-dropdown-item icon="el-icon-tickets"   @click.native="openWin2('批量修改墓位#/commonEdit#公墓信息管理系统/业务管理/墓位管理/批量修改墓位#cemetery')">批量修改墓位</el-dropdown-item-->
                                <el-dropdown-item icon="el-icon-tickets"   @click.native="openWin3(`修改墓位#/commonEdit#${systemNames}/业务管理/墓位管理/批量修改墓位2#cemetery`)">修改墓位</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-tickets"   @click.native="openWin3('修改墓位图#/commonEdit#公墓信息管理系统/业务管理/墓位管理/批量修改墓位图#cemetery')">修改墓位图</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-delete" @click.native="delMw()">删除墓位</el-dropdown-item>
                           
                            </el-dropdown-menu> 
                        </el-dropdown>
                        <el-button type="success" style='margin-left:10px'  v-if="isSet2!='Y'"  @click.native="openWin4('调价#/commonEdit#公墓信息管理系统/业务管理/墓位管理/调价')">
                            调价
                        </el-button>
                         <el-button type="success" style='margin-left:10px'  v-if="isSet2=='Y'||isSet2=='A'"  @click.native="changeStatus('锁定')">
                            锁定
                        </el-button>
                         <el-button type="success" style='margin-left:10px' v-if="isSet2=='Y'||isSet2=='A'" @click.native="changeStatus('放开')">
                            放开
                        </el-button>
                </div>
                <div class='search' style='border:1px solid #ddd;background:#fff;margin-bottom:5px;padding:10px;height:60px;'>
                    <el-form :inline="true"  class="demo-form-inline">
                        <el-form-item label="寄存位编号" v-if="type=='jc'">
                            <el-input v-model.lazy="form.bh" placeholder="墓穴编号" style='width:100%'></el-input>
                        </el-form-item>
                        <template v-else>
                            <el-form-item label="墓穴编号" >
                                <el-input v-model.lazy="form.bh" placeholder="墓穴编号" style='width:100%'></el-input>
                            </el-form-item>
                            <el-form-item label="柜ID" >
                                <el-input v-model.lazy="form.bh2" placeholder="柜ID" style='width:100%'></el-input>
                            </el-form-item>
                        </template>
                         
                       <el-form-item label="认购人">
                            <el-input v-model.lazy="form.rgr" placeholder="认购人"  style='width:100%'></el-input>
                        </el-form-item>
                        <el-form-item label="使用人" >
                            <el-input v-model.lazy="form.syr" placeholder="使用人"  style='width:100%'></el-input>
                        </el-form-item>
                        <el-form-item label="搜索范围" v-if="showAllSearch&&type!='jc'" >
                            <el-select v-model.lazy="form.searchType" placeholder="搜索范围"  style='width:80px;height:30px'>
                                <el-option label="本墓区" value=""></el-option>
                                <el-option label="所有墓区" value="all"></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <el-button type="primary" @click="goSearchs">查询</el-button>
                        </el-form-item>
                        <el-form-item  v-if="isSet!='Y'&&isSelect!='Y'&&isApp!='Y'&&type!='jc'&&sCode=='dhtl'">
                            <el-button type="primary" @click="openPlGm()">批量购买</el-button>
                        </el-form-item>
                        <el-form-item  v-if="isSet!='Y'&&isSelect!='Y'&&isApp!='Y'&&isYd=='Y'">
                            <el-button type="primary" @click="openYd()">预定</el-button>
                        </el-form-item>
                       
                    </el-form> 
                </div>
                <div class='statuss' >
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='未出售'}" @click="changeGmStatu('未出售')">未出售</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='预定'}" @click="changeGmStatu('预定')">预定</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='购买'}" @click="changeGmStatu('购买')">购买</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='预约安葬'}" @click="changeGmStatu('预约安葬')" v-if="sCode=='lygrwy'">预约安葬</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='部分安葬'}" @click="changeGmStatu('部分安葬')">部分安葬</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus=='全部安葬'}" @click="changeGmStatu('全部安葬')">全部安葬</div>
                    <div :class="{'status_item':true,'status_item_active':gmStatus==''}" @click="changeGmStatu('')">全部</div>
                </div>
                <div class='content_main' v-if="rightCememtery.length>0">
                    
                    
                    <div class='contents'  v-loading="loading"  >
                    
                        <div class='contents_left' ref="contents_left">
                            <div class='contents_left_head' style='height:50px'>&nbsp;</div>
                            <div class='contents_left_content'  v-if="maxRows.length<=1">
                                <div class='contents_left_content_item' v-for="index of maxRow" :key="index" :style='{"height":oneHeight2,"lineHeight":oneHeight2}'>
                                    {{index}}
                                </div>
                            </div>
                             <div class='contents_left_content'  v-else>
                                <div class='contents_left_content_item' v-for="index of maxRows" :key="index" :style='{"height":oneHeight2,"lineHeight":oneHeight2}'>
                                    {{index}}
                                </div>
                            </div>
                        </div>
                        <div class='contents_right'>
                            <div class='contents_head' ref="contents_head_item">
                                <div :style="{'width':maxWidth}"  v-if="maxRows.length<=1">
                                <div class='contents_head_item'  v-for="index of maxCol" :key="index"  :style='{"width":oneWidth2}'>
                                    {{index}}
                                </div>
                                </div>
                                  <div :style="{'width':maxWidth}"  v-else>
                                <div class='contents_head_item'  v-for="index of maxCols" :key="index"  :style='{"width":oneWidth2}'>
                                    {{index}}
                                </div>
                                </div>
                            </div>
                            <div class='contents_gm' ref="contents"  @scroll="sysHandleScroll()">
                                <div class='contents_gm_c'>
                                    <input type='checkbox' id="all" @click="checkedAll(rightCememtery)" v-if="rightCememtery.length>0 && isCheckbox=='Y'"/><label for="all"  v-if="rightCememtery.length>0&& isCheckbox=='Y'">全选</label>
                                
                                    <div class='car_row' v-for="(item,index) in rightCememtery" :key="index" :style="item.widths" >
                                        <input type='checkbox' style='float:left;' @click="checkedMore(item.child,index)" :checked="fruitIdss.indexOf('a'+index)>=0"  v-if="isCheckbox=='Y'"/>
                                        <div class='card_item' v-for="(child,index2) in item.child" :key="index2" :style='{"marginBottom":"10px","marginRight":marginRight,"width":oneWidth}'>
                                            <el-card :body-style="{ padding: '0px' }" :class="child.gmClass">
                                                <div   v-if="child.gm_ex19=='墓穴'"  @dblclick="selectoks(item,index,index2,true)"  @click="itemClick(item,index,index2,true)"  :class='{"gm":true,"noCheckout":child.noCheckout}' :style='{"height":oneHeight}'>
                                                    <div class='gm_child'>
                                                        <div :class='child.head' :style='{background:mxColor2[child.head],fontSize:fontSize,color:fontColor[child.head]}' v-if="child.gm_ex6">
                                                            <input type='checkbox' style='float:left' @click.stop="checkedOne(child.gm_id)" :checked="fruitIds.indexOf(child.gm_id)>=0"  v-if="isCheckbox=='Y'"/>
                                                            <input type='checkbox'  style='float:left'  :checked="fruitIds.indexOf(child.gm_id)>=0" @click.stop="itemClick(item,index,index2,false)"  v-if="(isSelect=='Y'||(isCheckbox!='Y'&&child.gm_ex9=='未出售'))" />
                                                            <!--i class='icon iconfont icon-iconfontzhizuobiaozhunbduan27' style='font-size:12px;color:#fff;margin-right:2px;vertical-align: middle' v-if="child.gm_ex9=='未出售'&&isCheckbox!='Y'&&isSelect!='Y'"></i>
                                                            <i class='icon iconfont icon-goumai' style='font-size:14px;color:#fff;margin-right:2px;vertical-align: middle' v-if="child.gm_ex9=='购买'&&isCheckbox!='Y'&&isSelect!='Y'"></i>
                                                            <i class='icon iconfont icon-leimupinleifenleileibie'   style='font-size:12px;color:#fff;margin-right:2px;vertical-align: middle' v-if="child.gm_ex9=='部分安葬'&&isCheckbox!='Y'&&isSelect!='Y'"></i>
                                                            <i class='icon iconfont icon-quanbu' style='font-size:10px;color:#fff;margin-right:2px;vertical-align: middle' v-if="child.gm_ex9=='全部安葬'&&isCheckbox!='Y'&&isSelect!='Y'"></i>
                                                            <i class='icon iconfont icon-yudingbaoliu' style='font-size:12px;color:#fff;margin-right:2px;vertical-align: middle' v-if="child.gm_ex9=='预定'&&isCheckbox!='Y'&&isSelect!='Y'"></i-->
                                                            <span style='display:inline-block;vertical-align: middle' v-if="gmType.indexOf('simple')==-1">{{child.gm_ex6}} </span>
                                                             <span style='display:inline-block;vertical-align: middle' v-else> 
                                                                 <template v-if="child.gm_ex3==''">
                                                                  {{child.gm_ex20}}-{{child.gm_ex21}}
                                                                 </template>
                                                                 <template v-else>
                                                                     {{child.gm_ex3}}-{{child.gm_ex4}}
                                                                 </template>
                                                             </span>
                                                            <!--span v-if="child.noCheckout" style='color:red;font-size:10px'>(未结)</span-->
                                                        </div>
                                                        <div :class='child.head' :style='{background:mxColor2[child.head]}' v-else>
                                                            {{child.gm_ex3}}-{{child.gm_ex4}}
                                                        </div>
                                                       
                                                        <el-dropdown  @command="handleClick" v-if="isSet!='Y' && isSelect!='Y' && isSelect!='Y1'" trigger="click" class='gm_content'>
                                                            <div  class='gm_content' v-html="child.namenews" :class="child.content" @click="gmClick(child,$event)">
                                                            
                                                            </div>
                                                        
                                                            <el-dropdown-menu slot="dropdown" class='mydropdown'  v-if="gmType.indexOf('simple')==-1">
                                                                    <el-dropdown-item icon="el-icon-s-goods" v-for="(menu,index) in child.menus" :key="index" :command="menu.msg">{{menu.name}}</el-dropdown-item>
                                                                    
                                                            </el-dropdown-menu>
                                                        </el-dropdown>
                                                        <div class='gm_content' v-html="child.namenews" :class="child.content" v-else></div>
                                                        <div class="bottom clearfix" style='font-size:13px' v-if="gmType.indexOf('simple')==-1">
                                                        
                                                            
                                                            <el-dropdown  @command="handleClick" v-if="isSet!='Y' && isSelect!='Y'&& isSelect!='Y1' && isSet2!='Y'&& isSet2!='A'" trigger="click">
                                                                <span class="el-dropdown-link">
                                                                    操作<i class="el-icon-arrow-down el-icon--right"></i>
                                                                </span>
                                                                <el-dropdown-menu slot="dropdown" class='mydropdown'>
                                                                    <el-dropdown-item icon="el-icon-s-goods" v-for="(menu,index) in child.menus" :key="index" :command="menu.msg">{{menu.name}}</el-dropdown-item>
                                                                    
                                                                </el-dropdown-menu>
                                                            </el-dropdown>
                                                        </div>
                                                        <div class='bottom_text' style='display:none'>
                                                            {{child.gm_ex20}}-{{child.gm_ex21}}
                                                        </div>
                                                    </div>
                                                </div>

                                                <div v-if="child.gm_ex19=='空地'" class='gm'  :style='{"height":oneHeight}'>
                                                    <div class='gm_child'>
                                                        <div class='head5' >
                                                            空地
                                                        </div>
                                                        <div class='gm_content'>
                                                        
                                                        </div>
                                                        <div class="bottom clearfix" style='font-size:13px'>
                                                        </div>
                                                    </div>
                                                </div>

                                            </el-card>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            
                        </div>
                        
                        
                        


                    </div>
                </div>
                
                
                <div v-if="rightCememtery.length==0" class='noCemeteryDiv'>
                    
                    <div slot="empty" style='text-align:center'>
          
                        <img src="../../assets/img/nodata.png" />
                    
                    <div>
                        暂无数据
                    </div>
                    </div>
                </div>
                
            </el-col>
        </el-row>
    </div>
</template>
<script>
import commonList  from '../list/commonList.vue'

export default {
    name:"cemetery_mx",
    props:["type",'isCheckbox','isSet','isSelect',"exkey","pId","data","gm",'isEmpty','isTitle','isView','iszj','isSet2','isList','iszp','fileType','fileName','fileName2','gmTypes','systemName'],
     components: {
       commonList
    },
    data(){
        return{
            showAllSearch:true,
            sCode:localStorage.getItem("sCode"),
            isApp:sessionStorage.getItem("isApp"),
            menu : [],
            leftMenu:[],
            rightCememtery:[],
            maxRow:1,
            maxCol:1,
            maxRows:[],
            maxCols:[],
            oneWidth:"",
            marginRight:"5px",
            oneWidth2:"",
            maxWidth:0,
            oneHeight:"",
            oneHeight2:"",
            gmType:"",
            gm_id:'',
            gm_idMain:'',
            active:'',
            areaId:'',
            gmStatus:"",
            loading:false,
            selectIndex:"-1",
            clickItem:null,
            appid:"",
            defaultProps: {
                children: 'child',
                label: 'title'
            },
            defaultShowNodes:[],
            fruitIds:[],
            fruitIdss:[],
            clickItems:[],
            form:{
                bh:"",
                bh2:"",
                syr:"",
                rgr:"",
                searchType:""
            },
            isApp:localStorage.getItem("isApp"),
            isAppTop:localStorage.getItem("isAppTop"),
            mxColor:[{
                color:"rgb(214, 202, 11)",
                label:"未出售"
            },{
                color:"rgb(79, 197, 12)",
                label:"购买"
            },{
                color:"rgb(232, 0, 232)",
                label:"部分安葬"
            },{
                color:"#4a90e2",
                label:"全部安葬"
            },{
                color:"rgb(160, 110, 26)",
                label:"预订"
            }],
            mxColor2:{
                'head':'rgb(214, 202, 11)',
                'head2':'#4fc50c',
                'head3':'#e800e8',
                'head4':'#4a90e2',
                'head5':'rgb(111, 122, 7)',
                'head7':'rgb(214, 202, 11)'
            },
            fontColor:{
                'head':'#fff',
                'head2':'#fff',
                'head3':'#fff',
                'head4':'#fff',
                'head5':'#fff',
                'head7':'#fff'
            },
            fontSize:'12px',
            isYd:"N",
            systemNames:"公墓信息管理系统"
            
        }
    },
   inject: ['selectClickOK'],//input-select-list-custome.vue
    created(){ 
       //
       if(this.systemName){
            this.systemNames=this.systemName
       }
       //alert(this.systemNames+"=="+this.systemName)
        let sCode=localStorage.getItem("sCode");
        if(sCode=="haysy"){//永思园有预定按钮
            this.isYd="Y"
        }
        this.gmType=localStorage.getItem(sCode+"gmType");
        if(this.gmType.indexOf('simple')!=-1){
           // this.fontSize="10px";
        }
        if(this.gmTypes){
            this.gmType=this.gmTypes;
        }
        if(this.sCode=='dhtl'){
            this.showAllSearch=true;
            this.form.searchType="all"
        }
        if(this.iszj=='Y'){
            this.mxColor=[{
                color:"rgb(214, 202, 11)",
                label:"未出售"
            },{
                color:"rgb(79, 197, 12)",
                label:"购买"
            },{
                color:"rgb(232, 0, 232)",
                label:"部分安葬"
            },{
                color:"#4a90e2",
                label:"全部安葬"
            }];
            this.mxColor2={
                'head':'rgb(214, 202, 11)',
                'head7':'rgb(214, 202, 11)',
                'head2':'#4fc50c',
                'head3':'#e800e8',
                'head4':'#4a90e2',
                'head5':'rgb(111, 122, 7)'
            }
        }
        /*if(localStorage.getItem("sCode")=="lygrwy"){
            if(this.isView=='Y'){
                this.mxColor=[{
                    color:"rgb(79, 197, 12)",
                    label:"未出售"
                },{
                    color:"rgb(232, 0, 232)",
                    label:"购买"
                }]

                this.mxColor2={
                    'head':'#4fc50c',
                    'head7':'#4fc50c',
                    'head2':'#e800e8',
                    'head3':'#e800e8',
                    'head4':'#e800e8',
                    'head5':'#e800e8',
                    'head6':'#e800e8'
                }
            }else{
                this.mxColor=[{
                    color:"rgb(79, 197, 12)",
                    label:"未出售"
                },{
                    color:"rgb(232, 0, 232)",
                    label:"购买"
                },{
                    color:"rgb(160, 110, 26)",
                    label:"预订"
                }]

                this.mxColor2={
                    'head':'#4fc50c',
                    'head7':'#4fc50c',
                    'head2':'#e800e8',
                    'head3':'#e800e8',
                    'head4':'#e800e8',
                    'head5':'rgb(111, 122, 7)'
                }
            }
            
            
        }else*/ if(localStorage.getItem("sCode")=="dhtl"){
            this.mxColor=[{
                color:"#f2f1f3",
                label:"空闲"
            },{
                color:"rgb(79, 197, 12)",
                label:"已销售"
            },{
                color:"#417505",
                label:"部分安葬"
            },{
                color:"#4a90e2",
                label:"全部安葬"
            },{
                color:"#e800e8",
                label:"未定价"
            }]
            this.mxColor2={
                'head':'#f2f1f3',
                'head2':'#4fc50c',
                'head3':'#417505',
                'head4':'#4a90e2',
                'head5':'rgb(111, 122, 7)',
                'head7':'#e800e8'
            };
            this.fontColor={
                'head':'#000',
                'head2':'#fff',
                'head3':'#fff',
                'head4':'#fff',
                'head5':'#fff',
                'head7':'#fff'
            }
        }
        this.gm_idMain=this.$route.query.sId;
        this.appid=this.$route.query.appid;
        let sef=this;
        this.loadLeft();
        this.loadColor();
        if(this.isSelect=="Y"&&this.isApp=="Y"){
           this.gmType="simple"
       }
        window.addEventListener('message', function(messageEvent) {
           sef.loadLeft();
        // vue.menuTitle = data;
           // sef.$refs.commonList.isShowTable();
        },false);
    },
    methods: {
        loadhide(){
            
            //document.getElementById('cube-wrapper').style.display = "none";
            //document.getElementById('preloader-body').style.display = "none";
        },
        loadColor(){
            this.$post("cemetery","/cemetery/getCemeteryColor",{isView:this.isView}).then(data=>{
                let colors=data.colors;
                let colors2=data.colors2;
                let fontColor=data.fontColor;
                if(colors.length>0){
                    this.mxColor=colors;
                    this.mxColor2=colors2;
                    this.fontColor=fontColor;
                }

            })
        },
        selectok2(){
            console.log("1111111111111111111111111111111111111111111111111222");
            console.log(this.clickItems)
            let items=[];
            for(let i=0;i<this.clickItems.length;i++){
                if(this.isEmpty=="Y"){
                    console.log("gm_ex9======"+this.clickItems[i].gm_ex9)
                    if(this.clickItems[i].gm_ex9=="未出售"){
                        let item={};
                        for(let key in this.clickItems[i]){
                            if(key!="menus"&&key!="names"&&key!="namenews"){
                                item[key]=this.clickItems[i][key]
                            }
                        }
                        items.push(item)
                    }
                }
            }
            return items;
        },
        openAddArea(url,type){
               let pId=this.areaId;
               if(!pId||pId==undefined||pId=="undefined"||pId.indexOf("p")!=-1){
                   pId="-1";
               }
               //alert(this.areaId)
            //if(this.areaId){
                let datas={};
                datas.buttonName="新增区";
                datas.url=url;
                datas.exId=this.gm_id;
                datas.sId="";
                datas.pId=pId;
                datas.width="500px";
                datas.height="350px";
                datas.filename2="公墓信息管理系统/业务管理/墓区管理/新增墓区";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
                //parent.postMessage(JSON.stringify(datas),'*');
           /* }else{
                this.$alert('请先选择一行数据', '错误提示', {
                    confirmButtonText: '确定',
                    callback: action => {}
                });
                return;
            }*/
            
        },
        openEdit(child){
           // alert(this.isSet+"=="+this.isSelect+"=="+this.isApp)
           // if(this.isSet!='Y'&&this.isSelect!='Y'&&this.isApp!='Y'){
            if(this.isSet!='Y'&&this.isSelect!='Y'){
                let datas={};
                datas.buttonName="墓位信息";
                datas.url="/commonEdit";
                datas.sId=child.gm_id
                datas.param_key="c_id";
                datas.params={"c_id":child.c_id};
                datas.filename2="公墓信息管理系统/业务管理/购买公墓";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
              
            }
           
        },
        openEditJc(child){
           // alert(this.isSet+"=="+this.isSelect+"=="+this.isApp)
           // if(this.isSet!='Y'&&this.isSelect!='Y'&&this.isApp!='Y'){
            if(this.isSet!='Y'&&this.isSelect!='Y'){
                let datas={};
                datas.buttonName="寄存信息";
                datas.url="/commonEdit";
                datas.sId=child.gm_id
                datas.filename2="公墓信息管理系统/业务管理/寄存登记";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
              
            }
           
        },
        openList(item){
            
            item=JSON.parse(item)
            let datas={};
            datas.buttonName=item.buttonName;
            datas.url="/commonEdit";
            datas.sId=item.sId
            datas.filename2=item.filename2;
            datas.appid="business";
            this.$emit("openWin",JSON.stringify(datas))
        },
        openEditArea(url){
            if(this.areaId){
                let datas={};
                datas.buttonName="修改区";
                datas.url=url;
                datas.exId=this.gm_id;
                datas.sId=this.areaId;
                datas.width="500px";
                datas.height="350px";
                datas.filename2="公墓信息管理系统/业务管理/墓区管理/修改墓区";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
                //parent.postMessage(JSON.stringify(datas),'*');
            }else{
                this.$alert('请先选择一行数据', '错误提示', {
                    confirmButtonText: '确定',
                    callback: action => {}
                });
                return;
            }
            
        },
        openPlGm(){
          //  if(this.fruitIds.length>0){
                let datas={};
                datas.buttonName="批量购买";
                datas.url="/commonEdit";
                datas.exId="";
                datas.sId="";
                datas.ids=this.fruitIds.join(",");
                datas.width="80VH";
                datas.height="76VH";
                datas.left="10VH";
                datas.top="12VH"
                datas.filename2="公墓信息管理系统/业务管理/批量购买";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
                //parent.postMessage(JSON.stringify(datas),'*');
          /*  }else{
                this.$alert('请先选择一行数据', '错误提示', {
                    confirmButtonText: '确定',
                    callback: action => {}
                });
                return;
            }*/
        },
        openYd(){
           // if(this.fruitIds.length>0){
                let datas={};
                datas.buttonName="预定";
                datas.url="/commonEdit";
                datas.exId="";
                datas.sId=this.fruitIds[0];
                datas.ids="";
                datas.width="80VH";
                datas.height="76VH";
                datas.left="10VH";
                datas.top="12VH"
                datas.filename2="公墓信息管理系统/业务管理/预定管理/预定公墓";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
                //parent.postMessage(JSON.stringify(datas),'*');
           /* }else{
                this.$alert('请先选择一行数据', '错误提示', {
                    confirmButtonText: '确定',
                    callback: action => {}
                });
                return;
            }*/
        },
         openPlGm2(){
            if(this.fruitIds.length>0){
                let datas={};
                datas.buttonName="迁坟登记";
                datas.url="/commonEdit";
                datas.exId="";
                datas.sId="";
                datas.ids=this.fruitIds.join(",");
                datas.width="80VH";
                datas.height="76VH";
                datas.left="10VH";
                datas.top="12VH"
                datas.filename2="公墓信息管理系统/业务管理/迁坟管理/迁坟登记";
                datas.appid="business";
                this.$emit("openWin",JSON.stringify(datas))
                //parent.postMessage(JSON.stringify(datas),'*');
            }else{
                this.$alert('请先选择一行数据', '错误提示', {
                    confirmButtonText: '确定',
                    callback: action => {}
                });
                return;
            }
        },
        openWin(url){
            let urls=url.split("#");
            let datas={};
            datas.buttonName=urls[0];
            datas.url=urls[1];
            datas.pId=this.gm_id;
            datas.exId=this.areaId;
            datas.width="650px";
            datas.height="450px";
            datas.filename2=urls[2];
            datas.appid=urls.length>3 ? urls[3]:"business";
            this.$emit("openWin",JSON.stringify(datas))
           // parent.postMessage(JSON.stringify(datas),'*');
        },
        openWin2(url){
            let urls=url.split("#");
            let datas={};
            datas.buttonName=urls[0];
            datas.url=urls[1];
            datas.sId=this.areaId;
            datas.exId=this.gm_id;
            datas.width="850px";
            datas.height="550px";
            datas.filename2=urls[2];
            datas.appid=urls.length>3 ? urls[3]:"business";
            this.$emit("openWin",JSON.stringify(datas))
           // parent.postMessage(JSON.stringify(datas),'*');
        },
        openWin3(url){
            let urls=url.split("#");
            let datas={};
            datas.buttonName=urls[0];
            datas.url=urls[1];
            datas.sId=this.fruitIds.join(",");
            datas.width="850px";
            datas.height="550px";
            datas.filename2=urls[2];
            datas.appid=urls.length>3 ? urls[3]:"business";
            this.$emit("openWin",JSON.stringify(datas))
           // parent.postMessage(JSON.stringify(datas),'*');
        },
         openWin4(url){
             
            let urls=url.split("#");
            let datas={};
            datas.buttonName=urls[0];
            datas.url=urls[1];
            datas.sId=this.fruitIds.join(",");
            datas.ids=this.fruitIds.join(",");
            datas.width="650px";
            datas.height="450px";
            datas.filename2=urls[2];
            datas.appid=urls.length>3 ? urls[3]:"business";
            this.$emit("openWin",JSON.stringify(datas))
           // parent.postMessage(JSON.stringify(datas),'*');
        },
        changeStatus(status){
            this.$confirm('确定要'+status+"选中的墓位？", '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$post("cemetery","/cemeterySet/changeStatuss",{ids:this.fruitIds.join(","),status:status=="锁定" ? "Y":"N"}).then(data=>{
                     this.$message({
                        message: data.msg,
                        type: 'success'
                        });
                        this.goSearchs();
                })
            }).catch(() => {
                
            });
        },
        initData(){
            this.loadLeft();
        },
        goSearch(){
            this.loadLeft();
            
        },
        gmClick(item,event){
            console.log(event.target)
            console.log(event)
            if(item.gm_ex38&&item.gm_ex38!=undefined&&item.gm_ex38!="undefined"){
                let src=item.gm_ex38;
                src=src.replace("thumb/","");
                this.$previewImg({ src: src });
                event.preventDefault();
            }
           /* if(event.target.className=="gms gmimg"){
                let src=event.target.src;
                src=src.replace("thumb/","");
                this.$previewImg({ src: src });
                event.preventDefault();
            }*/
        },
        loadLeft(){
            this.fruitIds=[];
            this.fruitIdss=[];
            this.clickItems=[];
            console.log("appid========="+this.appid);
            this.$post("cemetery","/cemetery/getAarea",{gm_id:this.gm_idMain,iszj:this.iszj,type:this.type}).then(data=>{
                this.leftMenu=data;
                let child=null;
                if(this.leftMenu.length>0){
                    if(this.active){
                         this.defaultShowNodes=[];
                         this.defaultShowNodes.push(this.active);
                         this.loadRight(this.active)
                    }else{
                        
                        let isOk=true;
                        child=this.leftMenu[0].child;
                        while(isOk){
                            if(child.length>0){
                                if(child[0].child&&child[0].child.length>0)
                                    child=child[0].child;
                                else
                                    isOk=false;
                            }else{
                                isOk=false;
                            }
                        }
                        this.active=child[0].id;
                        this.loadRight(child[0].id)
                        this.defaultShowNodes=[];
                        this.defaultShowNodes.push(child[0].id);
                        
                        this.gm_id=child[0].pId;
                        this.areaId=child[0].id;
                        this.$refs.elMenu.setCheckedKeys([child[0].id]);
                    }
                    
                }else{
                     this.loading=false;
                     this.loadhide();
                    
                }
               
                
            })
        },
        goSearchs(){
            this.loadRight(this.areaId);
        },
        loadRight(id){
           this.loading=true;
           this.areaId=id;
           if(this.isList=="Y"){
              
                this.$refs.commonLists.setSearchVal("gm_ex15",id)
                
                this.loading=false;
                this.loadhide();
           }else{
               this.$post("cemetery","/cemetery/getCemetery",{areaId:id,'syr':escape(this.form.syr),'bh':escape(this.form.bh),'bh2':escape(this.form.bh2),'rgr':escape(this.form.rgr),'status':escape(this.gmStatus),'isView':this.isView,'iszj':this.iszj,gmType:this.gmType,searchType:this.form.searchType,type:this.type,iszp:this.iszp,fileType:this.fileType,fileName:this.fileName,fileName2:this.fileName2}).then(data=>{
                    this.rightCememtery=data.data;
                    this.maxRow=Number(data.maxRow);
                    this.maxCol=Number(data.maxCol);
                    this.maxRows=data.rowList.split(",");
                    this.maxCols=data.colList.split(",");
                    this.oneWidth=data.oneWidth+"px";
                    this.oneHeight=data.oneHeight+"px";
                    this.oneHeight2=data.oneHeight2+"px";
                    this.marginRight=data.marginRight;
                    this.oneWidth2=(Number(data.oneWidth)+5)+"px"
                    this.maxWidth=((Number(data.oneWidth)+5)*this.maxCol+20)+"px";
                    if(this.gmType=="simple2"){
                        this.oneWidth2=(Number(data.oneWidth)+10)+"px"
                        this.maxWidth=((Number(data.oneWidth)+10)*this.maxCol+20)+"px";
                    }
                    
                    
                    this.loading=false;
                    this.loadhide();

                    
                })
           }
          

           
        },
       
        handleOpen(key, keyPath) {
            console.log(key, keyPath);
        },
        handleClose(key, keyPath) {
            console.log(key, keyPath);
        },
        handleClick(command){
            let vals=command.split("#");
            if(vals[0]=="锁定墓位"){
                this.changeStatus("锁定")
            }else if(vals[0]=="放开墓位"){
                this.changeStatus("放开")
            }else if(vals[0]=="打印墓证"){
                
                let datas={};
                datas.buttonName=vals[0];
                datas.url="/list";
                datas.exId=vals[1];
                datas.model="业务管理/打印墓证";
                datas.key="公墓信息管理系统/打印墓证"
                datas.appid="business"
                datas.isList="Y"

                
                this.$emit("openWin",JSON.stringify(datas))
            }else if(vals.length==2){
                this.printOne(vals[0],vals[1])
            }else if(vals.length==5){
                let sId=vals[3].split("|");
                
                let datas={};
                datas.buttonName=vals[0];
                datas.url=vals[1];
                datas.sId=sId[0];
                if(sId.length>1){
                    
                    datas.param_key="c_id";
                    datas.params={"c_id":sId[1]};
                }
                datas.filename2=vals[2];
                datas.appid=vals[4];
                
                
                this.$emit("openWin",JSON.stringify(datas))


               
               // parent.postMessage(JSON.stringify(datas),'*');
            }else{
                this.$confirm(vals[0], '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    
                    this.$post(vals[3],vals[1],{filename:vals[2]}).then(data=>{
                        if(data[0].status=="+OK"){
                            this.$message(unescape(data[0].msg));
                            this.goSearchs()
                        }else{
                            this.$alert(unescape(data[0].msg), '错误提示', {
                                confirmButtonText: '确定',
                                callback: action => {}
                            });
                        }
                    });
                }).catch(() => {
                            
                });
            }
          
        },
        delArea(){
             this.$confirm('此操作将永久删除该墓区, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$post("business","/api/view/delCommonEdit",{ids:this.areaId,filename:"公墓信息管理系统/业务管理/墓区管理/修改墓区"}).then(data=>{
                    this.$message(unescape(data[0].msg));
                    this.goSearch()
                });
            }).catch(() => {
                         
            });
        },
        delMw(){
             this.$confirm('此操作将永久删除选中的墓位, 是否继续?', '提示', {
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
            }).then(() => {
                this.$post("business","/api/view/delCommonEdit",{ids:this.fruitIds.join(","),filename:"公墓信息管理系统/业务管理/墓位管理/修改墓位"}).then(data=>{
                    this.$message(unescape(data[0].msg));
                    this.goSearch()
                });
            }).catch(() => {
                         
            });
        },

        handleNodeClick(data, checked, node) {
            if(checked === true) {
                this.areaId=data.id;
                this.gm_id=data.pId;
                this.checkedId = data.id;
                this.$refs.elMenu.setCheckedKeys([data.id]);
                this.loadRight(data.id)
            } else {
                if (this.checkedId == data.id) {
                    this.$refs.elMenu.setCheckedKeys([data.id]);
                }
            }
        },
        handleNodeClick2(data) {
            this.areaId=data.id;
            this.gm_id=data.pId;
            this.checkedId = data.id;
            this.active=this.areaId;
            this.$refs.elMenu.setCheckedKeys([data.id]);
            this.loadRight(data.id)
        },
         sysHandleScroll() {
           
            this.$refs.contents_left.scrollTop = this.$refs.contents.scrollTop
            this.$refs.contents_head_item.scrollLeft=this.$refs.contents.scrollLeft
            
        },
        printOne(printName,sId){
           
            let item_={};
            item_.buttonName="打印"+printName;
           
            let isPrint="N";
            
            item_.url="/commonPrint?printName="+printName+"&appid=cemetery&sCurItem="+sId+"&token="+sessionStorage.getItem("token")+"&isPrint="+isPrint;
            
            if(isPrint=="Y"){
                
                let printData_={};
                printData_.printName=printName;
                printData_.sCurItem=sId;
                printData_.appid="cemetery";
                printData_.page="";
                printData_.limit="";
                printData_.sKey="";
                printData_.sKey2="";
                printData_.listname="";
                printData_.dataEx="";
                printData_.data=data.data;
                printData_.company="";
                printData_.token=sessionStorage.getItem("token");
                printData_.isPrint=isPrint;
                this.printData=printData_;
            }else
                this.$emit("openWin",JSON.stringify(item_))
                //this.$parent.openWin(JSON.stringify(item_));
        },
        checkedOne (fruitId) {
           
            let idIndex = this.fruitIds.indexOf(fruitId)
            if (idIndex >= 0) {
                // 如果已经包含了该id, 则去除(单选按钮由选中变为非选中状态)
                this.fruitIds.splice(idIndex, 1);
                let index=-1;
                for(let i=0;i<this.clickItems.length;i++){
                    let gm_id=this.clickItems[i].gm_id;
                    if(gm_id==fruitId){
                        index=i;
                    }
                }
                if(index>=0)
                    this.clickItems.splice(index, 1);
            } else {
                // 选中该checkbox
                this.fruitIds.push(fruitId)
                let item=null;
                console.log("fruitId======="+fruitId);
                for(let i=0;i<this.rightCememtery.length;i++){
                    let child=this.rightCememtery[i].child;
                    for(let j=0;j<child.length;j++){
                        let gm_id=child[j].gm_id;
                        if(gm_id==fruitId){
                            item=child[j];
                        }
                    }
                }
                if(item){
                    this.clickItems.push(item);
                }
                /*if(this.fruitIds.length == this.fruits.length){ 
                    this.isCheckedAll=true; 
                } else {
                    this.isCheckedAll=false; 
                }*/
            }
        },
        checkedMore(item,index){
            for(let i=0;i<item.length;i++){
                this.checkedOne(item[i].gm_id);
            }
            let idIndex = this.fruitIdss.indexOf('a'+index)
             if (idIndex >= 0) {
                // 如果已经包含了该id, 则去除(单选按钮由选中变为非选中状态)
                this.fruitIdss.splice(idIndex, 1);
             }else{
                  this.fruitIdss.push('a'+index)
             }
        },
        checkedAll(item){
            console.log(item)
            for(let i=0;i<item.length;i++){
                this.checkedMore(item[i].child,i);
            }
        },
        selectoks(item,index,index2,isok){
            if(this.isSelect=='Y'){
                this.itemClick(item,index,index2,false);
                this.selectClickOK();
            }
           
        },
        itemClick(item,index,index2,isok){
            
            
            if(this.gmType.indexOf('simple')!=-1&&isok&&this.isSelect!='Y'){
              //  console.log(item.child[index2],"item.child=-===")
                if(this.type=="jc"){
                    this.openEditJc(item.child[index2]);
                }else
                    this.openEdit(item.child[index2]);
                return;
            }
            let isOk=true;
            
             if(this.isCheckbox!="Y"&&this.isSelect!="Y"){
                 let gm_ex9=item.child[index2].gm_ex9;
                 
                 if(gm_ex9!="未出售"){
                    // this.$message.error('该墓位状态不能进行购买');
                     isOk=false;
                 }
                 
                 if(isOk){
                    this.selectIndex=index+"-"+index2;
                    this.clickItem=item.child[index2];
                    if(this.isSelect=="Y")
                        this.fruitIds=[];
                    this.checkedOne(item.child[index2].gm_id);
                }   
            }else if(this.isSelect=="Y"){
                this.selectIndex=index+"-"+index2;
                this.clickItem=item.child[index2];
                if(this.isSelect=="Y")
                    this.fruitIds=[];
                this.checkedOne(item.child[index2].gm_id);
                 this.selectClickOK();
            }
            //if(this.isSelect=='Y'){
             
            //}
        },
        selectOk(){
          
            if(this.clickItem){
               // alert(this.clickItem["gm_ex9"])
                if(this.clickItem["gm_ex9"]!="未出售"&&this.gm!="Y"&&this.gm!="A"){
                    
                    this.$message.error('该墓位已出售，不能选择');
                    return false;
                }else if((this.clickItem["gm_ex9"]!="完全安葬"&&this.clickItem["gm_ex9"]!="部分安葬")&&this.clickItem["gm_ex9"]!="全部安葬"&&this.gm=="Y"){
                    this.$message.error('该墓位未安葬，不能选择');
                    return false;
                }else if((this.clickItem["gm_ex9"]!="购买"&&this.clickItem["gm_ex9"]!="完全安葬"&&this.clickItem["gm_ex9"]!="部分安葬")&&this.clickItem["gm_ex9"]!="全部安葬"&&this.gm=="A"){
                    this.$message.error('该墓位购买，不能选择');
                    return false;
                }
                console.log("clickItem==============================================");
                console.log(this.clickItem)
                for(let key in this.clickItem){
                    if(key!="c_id"&&key.indexOf("c_ex")==-1&&key!="c_nam"&&key!="menus"&&key!="names"&&key!="namenews"){
                        console.log("key========"+key);
                        let val=this.clickItem[key];
                        if(key.indexOf("_dat")!=-1&&val.indexOf("1900-01-01")!=-1)
                            val="";
                        try{
                        this.$set(this.data[this.pId],key,val);
                        }catch(e){}
                    }
                }
                for(let key in this.exkey){
                    console.log("key====================="+key);
                    let keys=key.split(".");
                    if(key=="sId"){
                        this.$set(this.data,"sId",this.clickItem[this.exkey[key]])
                    }else{
                        if(keys.length>1){
                            let pId_=keys[0];
                            console.log("pId_============"+pId_);
                            console.log(this.clickItem[this.exkey[key]])
                            this.$set(this.data[pId_],keys[1],this.clickItem[this.exkey[key]]);//这个主要是pId跟当前的pId不是同一个，在exkey里额外指定了
                        }else
                            this.$set(this.data[this.pId],key,this.clickItem[this.exkey[key]]);
                    }
                    
                }
                if(this.gm!="Y"&&this.gm!="A"){
                    try{
                        this.$set(this.data[this.pId],"gm_ex9","购买");
                        this.$set(this.data[this.pId],"c_ex9","购买");
                    }catch(e){}
                }

                let gm_ex11=this.clickItem["gm_ex11"];
                this.$post("cemetery","byg/funeral/getFuneralSfItem",{"cname":gm_ex11,"ctype":"墓型"}).then(data=>{
                    let index=-1;
                    
                    let item=this.data["item"];
                    if(item){
                        for(let i=0;i<item.length;i++){
                            let szi_ex7=item[i].szi_ex7;
                            if(szi_ex7=="墓型"){
                                index=i;
                            }
                        }
                        if(index>=0){
                            this.$delete(this.data["item"],index);
                        }
                        this.$set(this.data["item"],this.data.item.length,data.item[0]);
                    }
                    
                });
                return true;
            }else{
                 this.$message.error('请先选择一个墓位');
                 return false;
            }
            
        },
        changeGmStatu(status){
            this.gmStatus=status;
            this.goSearchs();
        },
        returns(){
            history.back();
        },
    },
    watch:{
        active(val, oldVal){
            console.log("val===s=s=="+val+"="+oldVal);
        }
    }
}
</script>
<style scoped  src="../../assets/css/cemetery/cemetery.css">
</style>
<style scoped  src="../../assets/css/loading.css">
</style>
<style >
.gms{
    /*margin-left:3px;
    margin-top:3px;*/
    border-radius: 60px 60px 0 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.gms img{
    width:80px;
    height:43px;
    margin-top:4px;
}
.gm_nogm{
    color:#C2C2C2;
}

.gm_death{
    color:indigo;
}
.gm_death2{
    color:indianred;
}
.gm_gm{
    color:#1ea44d;
}
.gm_yuding{
    color:rgb(111, 122, 7);
}
.gm_nodeath{
    color:#1ea44d;
}
.statuss{
    background:#eef1f4;
    height:36px;
    margin-bottom: 5px;
    border:1px solid #ddd;
    border-radius: 5px;
    display:flex;
    flex-direction: row;
    padding-left:15px;
}
.status_item{
    margin-top:3px;
    line-height:30px;
    height:30px;
    padding-left:10px;
    padding-right:10px;
    cursor:pointer;
    margin-right:20px;
    border-radius: 5px;
}
.status_item:hover{
    background:#fff;
}
.el-menu--horizontal>.el-submenu .el-submenu__title{
    height:20px !important;
    line-height: 20px  !important;
    font-size:12px;
}
.menu{
    display:flex;
    flex-direction: column;
}
.mytree2{
    flex: 1;
    overflow:auto;
}
.icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
  }
.commonList_title_app{
    text-align:center;
    background:#2294f2;
    color:#fff;
}
.commonList_title_app2{
    text-align:center;
    height:60px;
    padding-top:30px;
    box-sizing: border-box;
    background:#2294f2;
    color:#fff;
    font-size:16px;
}
.search .el-form{
    display:flex;
    flex-direction: row;
}  
.search .el-form-item{
    display:flex !important;
    flex-direction: row;
}
.mytree>>> .el-tree-node__label{
    font-size:0.1rem;
}
</style>
<style lang="scss" >
.mytree{
     .el-tree-node__label{
        color:#262626;
        font-size:13px;
     }
     .el-tree > .el-tree-node:after {
      border-top: none;
    }
    .el-tree-node {
      position: relative;
      padding-left: 5px;
    }
    //节点有间隙，隐藏掉展开按钮就好了,如果觉得空隙没事可以删掉
    .el-tree-node__expand-icon.is-leaf{
      display: none;
    }
    .el-tree-node__children {
      padding-left: 16px;
    }
 
    .el-tree-node :last-child:before {
      height: 38px;
    }
 
    .el-tree > .el-tree-node:before {
      border-left: none;
    }
 
    .el-tree > .el-tree-node:after {
      border-top: none;
    }
 
    .el-tree-node:before {
      content: "";
      left: -4px;
      position: absolute;
      right: auto;
      border-width: 1px;
    }
 
    .el-tree-node:after {
      content: "";
      left: -4px;
      position: absolute;
      right: auto;
      border-width: 1px;
    }
 
    .el-tree-node:before {
      border-left: 1px dashed #ddd;
      bottom: 0px;
      height: 100%;
      top: -26px;
      width: 1px;
    }
 
    .el-tree-node:after {
      border-top: 1px dashed #ddd;
      height: 20px;
      top: 12px;
      width: 24px;
    }
    .el-tree-node__content{
       
    }
    
}
</style>